<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title>申请</title>

    <script src="/ss/static/js/jquery/jquery-2.1.4.min.js" type="text/javascript"></script>
    <script src="/ss/static/layui/layui.js" type="text/javascript"></script>
    <script src="/ss/static/js/index/index.js" type="text/javascript"></script>
    <script src="/ss/static/layui/lay/modules/layer.js" type="text/javascript"></script>
    <script src="/ss/static/js/index/sliders.js" type="text/javascript"></script>
    <script src="/ss/static/js/index/html5.js" type="text/javascript"></script>
    <script src="/ss/static/js/index/freezeheader.js" type="text/javascript"></script>
    <script src="/ss/static/js/custom.js" type="text/javascript"></script>
    <link rel="stylesheet" href="/ss/static/layui/css/layui.css" media="all"/>
    <link rel="stylesheet" href="/ss/static/layui/css/modules/layer/default/layer.css"/>
    <link rel="stylesheet" href="/ss/static/css/global.css"/>
</head>

<body>
<div th:replace="template.html::header"></div>

<div class="layui-container container">
    <div class="layui-row layui-col-space20">
        <div class="layui-col-md10">
            <div class="article-main">
                <h2>
                    申请列表
                </h2>
                <div class="article-list" th:each="apply : ${applies}">
                    <h3>
                        <a th:text="'申请号: ' + ${apply.getApid()}"></a>
                    </h3>
                    <p th:text="'类型: ' + ${apply.transType()}"></p>
                    <p th:text="'申请内容: ' + ${apply.getContent()}"></p>
                    <p class="autor">
                        <span>
                            <svg style="vertical-align: middle" width="15" height="15" viewBox="0 0 48 48" fill="none"
                                 xmlns="http://www.w3.org/2000/svg"><rect x="4" y="4" width="40" height="40" rx="2"
                                                                          fill="none" stroke="#333" stroke-width="4"
                                                                          stroke-linecap="round"
                                                                          stroke-linejoin="round"/><path
                                    d="M4 14H44" stroke="#333" stroke-width="4" stroke-linecap="round"
                                    stroke-linejoin="round"/><line x1="44" y1="11" x2="44" y2="23" stroke="#333"
                                                                   stroke-width="4" stroke-linecap="round"
                                                                   stroke-linejoin="round"/><path d="M12 22H16"
                                                                                                  stroke="#333"
                                                                                                  stroke-width="4"
                                                                                                  stroke-linecap="round"
                                                                                                  stroke-linejoin="round"/><path
                                    d="M22 22H26" stroke="#333" stroke-width="4" stroke-linecap="round"
                                    stroke-linejoin="round"/><path d="M32 22H36" stroke="#333" stroke-width="4"
                                                                   stroke-linecap="round" stroke-linejoin="round"/><path
                                    d="M12 29H16" stroke="#333" stroke-width="4" stroke-linecap="round"
                                    stroke-linejoin="round"/><path d="M22 29H26" stroke="#333" stroke-width="4"
                                                                   stroke-linecap="round" stroke-linejoin="round"/><path
                                    d="M32 29H36" stroke="#333" stroke-width="4" stroke-linecap="round"
                                    stroke-linejoin="round"/><path d="M12 36H16" stroke="#333" stroke-width="4"
                                                                   stroke-linecap="round" stroke-linejoin="round"/><path
                                    d="M22 36H26" stroke="#333" stroke-width="4" stroke-linecap="round"
                                    stroke-linejoin="round"/><path d="M32 36H36" stroke="#333" stroke-width="4"
                                                                   stroke-linecap="round" stroke-linejoin="round"/><line
                                    x1="4" y1="11" x2="4" y2="23" stroke="#333" stroke-width="4" stroke-linecap="round"
                                    stroke-linejoin="round"/></svg>
                            <a th:text="${#dates.format(apply.getDate(), 'yyyy-MM-dd HH:mm:ss')}"></a>
                        </span>
                        <span th:if="${apply.getState().equals('pending')}">
                            <svg style="vertical-align: middle" width="15" height="15"
                                 viewBox="0 0 48 48" fill="none"
                                 xmlns="http://www.w3.org/2000/svg"><path d="M7 42H43"
                                                                          stroke="#333"
                                                                          stroke-width="4"
                                                                          stroke-linecap="round"
                                                                          stroke-linejoin="round"/><path
                                    d="M11 26.7199V34H18.3172L39 13.3081L31.6951 6L11 26.7199Z" fill="none"
                                    stroke="#333"
                                    stroke-width="4" stroke-linejoin="round"/></svg>
                            <a style="cursor: pointer"
                               th:onclick="'accept(' + ${apply.getApid()} + ')'">接受</a>
                        </span>
                        <span th:if="${apply.getState().equals('pending')}">
                            <svg width="15" height="15" viewBox="0 0 48 48" fill="none"
                                 xmlns="http://www.w3.org/2000/svg" style="vertical-align: middle;"><path
                                    d="M9 10V44H39V10H9Z" fill="none" stroke="#333" stroke-width="4"
                                    stroke-linejoin="round" style="
"></path><path d="M20 20V33" stroke="#333" stroke-width="4" stroke-linecap="round" stroke-linejoin="round"></path><path
                                    d="M28 20V33" stroke="#333" stroke-width="4" stroke-linecap="round"
                                    stroke-linejoin="round"></path><path d="M4 10H44" stroke="#333" stroke-width="4"
                                                                         stroke-linecap="round"
                                                                         stroke-linejoin="round"></path><path
                                    d="M16 10L19.289 4H28.7771L32 10H16Z" fill="none" stroke="#333" stroke-width="4"
                                    stroke-linejoin="round"></path></svg>
                            <a style="cursor: pointer"
                               th:onclick="'decline(' + ${apply.getApid()} + ')'">拒绝</a>
                        </span>
                    </p>
                </div>
            </div>
            <!--分页-->
            <div id="page"></div>
        </div>
    </div>
</div>

<div th:replace="template.html::footer"></div>
<script type="text/javascript">
    function accept(apid) {
        $.ajax({
            url: '/ss/api/apply/' + apid,
            type: 'get',
            dataType: "json",
            contentType: "application/json;charset=utf-8",
            success: function (apply) {
                apply['state'] = 'success'
                $.ajax({
                    url: '/ss/api/apply',
                    type: 'put',
                    data: JSON.stringify(apply),
                    dataType: "json",
                    contentType: "application/json;charset=utf-8",
                    success: function (result) {
                        if (result['success']) location.reload()
                        else alert('操作失败')
                    }
                })
            }
        })
    }

    function decline(apid) {
        $.ajax({
            url: '/ss/api/apply/' + apid,
            type: 'get',
            dataType: "json",
            contentType: "application/json;charset=utf-8",
            success: function (apply) {
                apply['state'] = 'failure'
                apply['feedback'] = prompt('请输入拒绝的原因')
                $.ajax({
                    url: '/ss/api/apply',
                    type: 'put',
                    data: JSON.stringify(apply),
                    dataType: "json",
                    contentType: "application/json;charset=utf-8",
                    success: function (result) {
                        if (result['success']) location.reload()
                        else alert('操作失败')
                    }
                })
            }
        })
    }
</script>
</body>
</html>
